<template>
  <view class="container screen-width">
    <u-form :model="form" ref="uForm" :error-type="['toast']">
      <view class="box">
        <view class="box-item u-flex" v-if="needpwd">
          <view class="name">原密码</view>
          <!-- <u-form-item label prop="oldPassWord" :border-bottom="false"> -->
          <u-input type="password" v-model="form.oldPassWord" placeholder="请输入原密码" />
          <!-- </u-form-item> -->
        </view>
        <view class="box-item u-flex">
          <view class="name">新密码</view>
          <!-- <u-form-item label prop="newPassWord" :border-bottom="false"> -->
          <u-input type="password" v-model="form.newPassWord" placeholder="请输入新密码" />
          <!-- </u-form-item> -->
        </view>
        <view class="box-item u-flex">
          <view class="name">确认密码</view>
          <!-- <u-form-item label prop="newPassWordConfirm" :border-bottom="false"> -->
          <u-input type="password" v-model="form.newPassWordConfirm" placeholder="请输入确认密码" />
          <!-- </u-form-item> -->
        </view>
      </view>
    </u-form>
    <view class="submitBtn screen-width" @click="submit">提交</view>
    <Festival></Festival>
  </view>
</template>

<script>
import { changePwd } from "../../util/api/user";
export default {
  data() {
    return {
      oldTel: "",
      form: {
        oldPassWord: "",
        newPassWord: "",
        newPassWordConfirm: ""
      },
      needpwd: false
    };
  },
  onLoad(e) {
    //0显示原密码 1不显示原密码
    this.needpwd = e.needpwd === "0" ? true : false;
  },
  methods: {
    submit() {
      if (this.needpwd && !this.form.oldPassWord) {
        uni.showToast({
          title: "请输入原密码",
          duration: 2000,
          icon: "none"
        });
        return;
      }
      if (!this.form.newPassWord) {
        uni.showToast({
          title: "请输入新密码",
          duration: 2000,
          icon: "none"
        });
        return;
      }
      if (!this.form.newPassWordConfirm) {
        uni.showToast({
          title: "请输入确认密码",
          duration: 2000,
          icon: "none"
        });
        return;
      }
      if (this.form.newPassWord != this.form.newPassWordConfirm) {
        uni.showToast({
          title: "两次密码输入不一致",
          duration: 2000,
          icon: "none"
        });
        return;
      }
      changePwd(this.form.oldPassWord, this.form.newPassWord).then(res => {
        if (res.code === 200) {
          uni.showToast({
            title: "修改成功！",
            duration: 2000,
            icon: "none"
          });
          setTimeout(() => {
            uni.navigateBack();
          }, 1000);
        } else {
          uni.showToast({
            title: res.message,
            duration: 2000,
            icon: "none"
          });
        }
      });
    }
  }
};
</script>

<style lang="less" scoped>
/deep/ .uni-input-placeholder {
  padding: 0 30upx;
}
/deep/ .uni-input-input {
  padding: 0 30upx;
}
.container {
  position: relative;

  .submitBtn {
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 88rpx;
    background: #1678ff;
    line-height: 88rpx;
    text-align: center;
    color: #fff;
  }
}
.box {
  margin-top: 20rpx;
  padding: 0 20rpx;
  background: #fff;
  font-size: 30rpx;
  font-family: PingFang SC, PingFang SC-Regular;
  font-weight: 400;
  text-align: left;
  color: #333333;

  &-item {
    height: 100rpx;
    border-bottom: 1rpx solid #f1f1f1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    .name {
      // margin-right: 72rpx;
    }
  }

  .btn {
    height: 64rpx;
    opacity: 1;
    background: #e8f3ff;
    border-radius: 8rpx;
    font-size: 26rpx;
    font-family: PingFang SC, PingFang SC-Regular;
    font-weight: 400;
    text-align: right;
    color: #1678ff;
    padding: 14rpx;
  }
}
</style>
